
// UI共通(CSSフレームワーク等に依存する部分はここで実装)
var ui = {};

ui.Widget = function(htmlId) {
	this.htmlId = htmlId;
	this.jqObj = $("#" + htmlId);
};

ui.Button = function(htmlId, options) {
	ui.Widget.apply(this, arguments);
	this.options = $.extend({
		"onClick"  : null,
		"data" : {}
	}, options);
	this.enable = function() {
		this.jqObj.removeAttr("disabled");
	};
	this.disable = function() {
		this.jqObj.attr("disabled", "disabled");
	};
	if (isFunction(this.options.onClick)) {
		this.jqObj.bind("click", this.options.data, this.options.onClick);
	}
	// TODO buttonまではやりすぎかな
};

ui.Form = function(htmlId, options) {
	ui.Widget.apply(this, arguments);
	this.name = this.jqObj.attr("name");
	this.options = $.extend({
		"validate" : false,
		"onSubmit" : null,
		"data" : {}
	}, options);
	this.getValue = function(name) {
		// TODO trimする?
		var elem = $("[name=" + name + "]", this.jqObj);
		if (elem === undefined) {
			return null;
		}
		var length = elem.length;
		if (length === 1) {
			return $(elem).val();
		} else {
			var array = new Array(length);
			value.each(function(index, elem) {
				array[index] = $(elem).val();
			});
			return array;
		}
	};
	this.setValue = function(name, value) {
		var elem = $("[name=" + name + "]", this.jqObj);
		if (elem === undefined) {
			return;
		}
		// text only
		$(elem).val(value);
		// TODO Other form
	};
	this.jqObj.attr("novalidate", "novalidate");
	if (isFunction(this.options.onSubmit)) {
		// TODO validate
		this.jqObj.bind("submit", this.options.data, this.options.onSubmit);	
	}
};

// Screen
ui.Screen = function(htmlId, options) {
	ui.Widget.apply(this, arguments);
	this.options = $.extend({
		"title" : null,
		"postShow" : function(screen) {},
		"preHide" : function(screen) {}
	}, options);
	this.title = options.title;
	this.show = function() {
		if (this.options.title) {
			$("title").text(this.options.title);
		}
		this.jqObj.removeClass("hide").addClass("show");
		if (isFunction(this.options.postShow)) {
			this.options.postShow(this);
		}
	};
	this.hide = function() {
		if (isFunction(this.options.preHide)) {
			this.options.preHide(this);
		}
		this.jqObj.removeClass("show").addClass("hide");
	};
};

// 共通部分ここまで
//-----------------------------------------------------------------------------

// ログイン画面
ui.LoginScreen = function() {
	ui.Screen.call(this, "login-screen", {
		"preHide" : ui.LoginScreen.preHide
	});
	this.submitted = false;
	this.loginForm = new ui.Form("loginForm", {
		"onSubmit" : ui.LoginScreen.onSubmit
	});
	this.loginButton = new ui.Button("login-button");
	this.loginButton.enable();
};

ui.LoginScreen.onSubmit = function(jqEvent) {
	var ls = ui.LoginScreen.instance;
	if (ls.submitted) {
		// 二重サブミット禁止
		return false;
	}
	ls.submitted = true;
	var username = $("#login-username").val();
	var password = $("#login-password").val();
	var ifc = new Interface();
	ifc.login(username, password, ui.LoginScreen.onSuccess, ui.LoginScreen.onError);
	// 画面遷移防止
	return false;
};
ui.LoginScreen.onSuccess = function(data, textStatus, jqXHR) {
	debug("login success");
	// ログイン画面非表示
	var ls = ui.LoginScreen.instance;
	ls.hide();
	// TOP画面初期化
	var ts = ui.TopScreen.instance;
	ts.show();
};
ui.LoginScreen.onError = function(jqXHR, textStatus, errorThrown) {
	debug("login error." + data);
	var ls = ui.LoginScreen.instance;
	ls.submitted = false;
	// TODO error処理
};
ui.LoginScreen.preHide = function(screen) {
	debug("login screen hide.");
};
ui.LoginScreen.instance = new ui.LoginScreen();

// TOP画面
ui.TopScreen = function() {
	ui.Screen.call(this, "top-screen", {
		"title" : LABELS_TITLE_TOP,
		"postShow" : ui.TopScreen.postShow
	});
};
ui.TopScreen.postShow = function(screen) {
	debug("ui.TopScreen#show");
};
ui.TopScreen.instance = new ui.TopScreen();


ui.SideMenuScreen = function() {
	
};